<!DOCTYPE html>
<html>
<head>
    <title>添加药品</title>
    <meta charset="UTF-8">
    <link rel="stylesheet" type="text/css" href="../../Css/bootstrap.css"/>
    <link rel="stylesheet" type="text/css" href="../../Css/bootstrap-responsive.css"/>
    <link rel="stylesheet" type="text/css" href="../../Css/style.css"/>
    <script type="text/javascript" src="../../Js/jquery.js"></script>
    <!--<script type="text/javascript" src="../Js/jquery.sorted.js"></script>-->
    <script type="text/javascript" src="../../Js/bootstrap.js"></script>
    <script type="text/javascript" src="../../Js/ckform.js"></script>
    <script type="text/javascript" src="../../Js/common.js"></script>
    <script type="text/javascript" src="../../Js/ckeditor/ckeditor.js"></script>


    <style type="text/css">
        body {
            padding-bottom: 40px;
        }

        img{
            width: 120px;
            height: 110px;
        }

        .sidebar-nav {
            padding: 9px 0;
        }

        @media (max-width: 980px) {
            /* Enable use of floated navbar text */
            .navbar-text.pull-right {
                float: none;
                padding-left: 5px;
                padding-right: 5px;
            }
        }


    </style>
</head>
<body>
<form action="" method="post" class="definewidth m20">
    <table class="table table-bordered table-hover definewidth m10">
        <tr>
            <td width="10%" class="tableleft">药品编号</td>
            <td><input type="text" name="drId" value="" disabled/></td>
        </tr>
        <tr>
            <td width="10%" class="tableleft">图片</td>
            <td>
                <span><img src="" id="image"></span><br>
                <input type="file" name="drUrl" id="photoFile"/>
            </td>
        </tr>
        <tr>
            <td width="10%" class="tableleft">进价</td>
            <td><input type="text" name="drInprice" value=""/></td>
        </tr>
        <tr>
            <td width="10%" class="tableleft">售价</td>
            <td><input type="text" name="drOutprice" value=""/></td>
        </tr>
        <tr>
            <td width="10%" class="tableleft">药品名称</td>
            <td><input type="text" name="drName" value=""/></td>
        </tr>
        <tr>
            <td width="10%" class="tableleft">药品类型</td>
            <td>
                <input type="radio" name="drType" value="3"/>&nbsp;处方药&nbsp;&nbsp;&nbsp;
                <input type="radio" name="drType" value="1"/>&nbsp;中药&nbsp;&nbsp;&nbsp;
                <input type="radio" name="drType" value="2" checked/>&nbsp;西药
            </td>
        </tr>
        <tr>
            <td width="10%" class="tableleft">简单描述</td>
            <td><input type="text" name="drSimdesc" value=""/></td>
        </tr>

        <tr>
            <td width="10%" class="tableleft">保质期</td>
            <td><input type="text" name="drExpirationdate" /> 月</td>
        </tr>
        <tr>
            <td width="10%" class="tableleft">详细描述</td>
            <td><textarea name="drDetadesc"></textarea></td>
        </tr>
        <tr>
            <td width="10%" class="tableleft">生产厂商</td>
            <td><textarea name="drFactory"></textarea></td>
        </tr>
        <tr>
            <td width="10%" class="tableleft">服用说明</td>
            <td><input type="text" name="drDirection" /></td>
        </tr>

        <tr>
            <td width="10%" class="tableleft">备注</td>
            <td><textarea name="drRemark"></textarea></td>
        </tr>
        <tr>
            <td colspan="2">
                <center>
                    <button class="btn btn-primary" type="button" id="submit">保存</button> &nbsp;&nbsp;
                    <button type="button" class="btn btn-success" id="returnList">返回列表</button>
                </center>
            </td>
        </tr>
    </table>
</form>
</body>
<script type="text/javascript">

    String.prototype.GetValue= function(para) {
        let reg = new RegExp("(^|&)"+ para +"=([^&]*)(&|$)");
        let r = this.substr(this.indexOf("\?")+1).match(reg);
        if (r!=null) return unescape(r[2]); return null;
    }

    $(function () {
        let url = document.location.toString();
        let drId=url.GetValue("drId");
        let pageNum=url.GetValue("pageNum");

        //兼容 修改 新增 页
        if (drId === "" || drId === null){
            //首次加载拒绝 图片 药品编号 编辑
            $("#image").parent().parent().parent().addClass("hidden");
            $("input[name='drId']").parent().parent().addClass("hidden");
        }else{
            queryById(drId);
        }

        //返回
        $('#returnList').click(function () {
            window.location.href = "index.html?pageNum="+pageNum;
        });

        //修改
        $('#submit').click(function() {

            // 判断执行方式 修改 or 新增
            if (drId === "" || drId === null){
                addDrug(pageNum);
            }else {
                //图片上传可选状态
                let bool = true;
                //判断是否有无图片
                if ($("#photoFile").val() != "") {
                    //上传异常终止提交！
                    bool = uploadImage(drId);
                }
                if (bool){
                    updateDrug(drId, pageNum);
                }
            }

        });
    });

    function dataTest(){
        let drInprice = $("input[name='drInprice']").val();
        let drOutprice = $("input[name='drOutprice']").val();
        let drExpirationdate = $("input[name='drExpirationdate']").val();
        let drDetadesc = $("textarea[name='drDetadesc']").val();
        let drFactory = $("textarea[name='drFactory']").val();
        let drDirection = $("input[name='drDirection']").val();

        // 数据验证
        if(!isFloat(drInprice)){
            alert("请输入正确的进价数据！");
            return true;
        }
        if(!isFloat(drOutprice)){
            alert("请输入正确的售价数据！");
            return true;
        }
        if(isNaN(drExpirationdate) || drExpirationdate===""){
            alert("请输入正确的保质期数据！");
            return true;
        }
        if(drDetadesc.trim()===""){
            alert("请输入正确的描述数据！");
            return true;
        }
        if(drFactory.trim()===""){
            alert("请输入正确的生产厂商数据！");
            return true;
        }
        if(drDirection.trim()===""){
            alert("请输入正确的服用说明数据！");
            return true;
        }
        return false;
    }

    function addDrug(pageNum) {

        // 信息验证
        if (dataTest()) {
            return;
        }

        //新增提交
        $.ajax({
            type: "POST",
            url: "/drug",
            data: $("form").serialize(),
            dataType: "json",
            success: function (vo) {
                if (vo.code === 200) {
                    alert("添加成功！");
                    window.location.href = "index.html?pageNum=" + pageNum;
                } else {
                    alert("添加失败！" + vo.msg);
                }
            }
        });
    }

    // 浮点型正则比较
    function isFloat(n) {
        return /^\d*\.*\d+$/.test(n);
    }

    function updateDrug(drId, pageNum) {

        // 信息验证
        if (dataTest()) {
            return;
        }

        //修改提交
        $.ajax({
            type: "POST",
            url: "/drug",
            data: $("form").serialize() + "&_method=PUT" + "&drId=" + drId,
            dataType: "json",
            success: function (vo) {
                if (vo.code == 200) {
                    alert("更新成功！");
                    window.location.href = "index.html?pageNum=" + pageNum;
                } else {
                    alert("更新失败！" + vo.msg);
                }
            }
        });
    }

    function queryById(drId){
        //药物查询
        $.ajax({
            type: "GET",
            url: "/drug/"+drId, //RESTful风格的API定义
            data: "",
            success: function (vo) {
                let obj = vo.obj;
                $("input[name='drId']").val(obj.drId);
                $("input[name='drInprice']").val(obj.drInprice);
                $("input[name='drOutprice']").val(obj.drOutprice);
                $("input[name='drName']").val(obj.drName);
                $("input[name='drSimdesc']").val(obj.drSimdesc);
                $("input[name='drExpirationdate']").val(obj.drExpirationdate);
                $("textarea[name='drDetadesc']").val(obj.drDetadesc);
                $("textarea[name='drFactory']").val(obj.drFactory);
                $("input[name='drDirection']").val(obj.drDirection);
                $("textarea[name='drRemark']").val(obj.drRemark);


                //药物图片处理
                var drUrlNode = $("#image");
                if (obj.drUrl == null || obj.drUrl === ""){
                    drUrlNode.addClass("hidden");
                    drUrlNode.parent().html("未上传图片");
                }else{
                    drUrlNode.attr("src","../../Images/uploadFile/drug/"+obj.drUrl);
                }

                //药物分类
                let types = $("input[name='drType']");
                for (let i = 0 ; types.length > i ;i++){
                    let drType = $(types[i]);
                    if (obj.drType === drType.val()){
                        drType.prop("checked" , true);
                        break;
                    }
                }

            }
        });
    }

    function uploadImage(drId) {
        //图片上传
        var file = new FormData();
        file.append('file', document.getElementById('photoFile').files[0]);
        file.append('drId', drId);
        //图片上传
        $.ajax({
            url: "/drug/uploadImage",
            type:"post",
            contentType: false,
            processData: false,
            data: file,
            success: function(data) {
                if (data.code != 200){
                    alert("图片上传异常! "+data.msg);
                    return false;
                }
            },
            error: function (data){
                alert("图片上传异常!");
                return false;
            }
        });
        return true;
    }

</script>
</html>